<!DOCTYPE html>
<html style="background-color:#fff;height:100%">
<head>
    <meta charset="UTF-8">
    <title>软著表单页面</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="${re.contextPath}/plugin/layui/css/layui.css" media="all"/>
    <!--公用样式-->
    <link rel="stylesheet" type="text/css" href="${re.contextPath}/plugin/common/css/comment.css"/>
    <!--页面样式-->
    <link rel="stylesheet" type="text/css" href="${re.contextPath}/plugin/it/common/css/style.css"/>
    <style>
        .thesis {
            width: 100%;
            padding: 0px;
            height: 100%;
            overflow-y: hidden;
        }

        .thesis label {
            width: 30% !important;
        }

        .thesisbor > div {
            margin: 1% !important;
            padding: 0px 4% !important;
            width: 90% !important;
        }

        .beizhu-div {
            width: 60% !important;
        }

        .beizhu-div textarea {
            width: 100% !important;
        }

        .upload-file-div {
            width: 70% !important;
        }

        .upload-file-li {
            width: 90% !important;
        }

        .thesis input, .thesis select {
            width: 260px !important;
        }

        .file-name-span {
            margin-top: 8px !important;
        }

        .thesis input {
            width: 160px !important;
            padding: 0px 0px 0px 10px !important;
        }

        .layui-form-select input {
            width: 172px !important;
        }

        .h34 {
            height: 34px;
        }
    </style>
</head>
<body>
<!--新建文件夹-->
<form class="layui-form">
    <div class="layui-container" style="margin-top:40px;padding-bottom: 80px">
        <div class="thesis whitebg">
            <div class="ft20 bold">填写软著</div>
            <ul class="clearfix">
                <li class="clearfix h34">
                    <label class="fl gary">软著名称<span style="color: red">*</span></label>
                    <div class="fl">
                        <input type="hidden" name="spfId" value="${formData.spfId}">
                        <input type="text" name="spfF1" value="${formData.spfF1}" lay-maxlength="128"
                               lay-verify="maxlength|required" placeholder="填写软著名称"/>
                    </div>
                </li>
                <li class="clearfix h34">
                    <label class="fl gary">撰写人</label>
                    <div class="fl">
                        <input type="text" name="spfF2" value="${formData.spfF2}" lay-maxlength="128"
                               lay-verify="maxlength" placeholder="填写撰写人"/>
                    </div>
                </li>
                <li class="clearfix h34">
                    <label class="fl gary">著作权人<span style="color: red">*</span></label>
                    <div class="fl">
                        <input type="text" name="spfF3" value="${formData.spfF3}" lay-maxlength="128"
                               lay-verify="maxlength|required" placeholder="填写著作权人"/>
                    </div>
                </li>
            </ul>
            <div style="margin-top:10px">软著材料</div>
            <ul class="writingul">
                <li class="clearfix upload-file-li">
                    <label class="fl gary" style="width: 15%!important;">说明书</label>
                    <div class="fl upload-file-div">
                        <div>
                            <img id="file1100030001" lay-filter="file1100030001" src="/plugin/common/images/57@2x.png"
                                 class="thesisimg3 file-upload" filedata="{'type':'1100030001'}">
                            <span class="blue">上传Word</span>
                        </div>
                        <div class="thesisbor" style="width: 100%!important;">

                        </div>
                    </div>
                </li>
                <li class="clearfix upload-file-li">
                    <label class="fl gary" style="width: 15%!important;">源代码</label>
                    <div class="fl upload-file-div">
                        <div>
                            <img id="file1100030002" lay-filter="file1100030002" src="/plugin/common/images/57@2x.png"
                                 class="thesisimg3 file-upload" filedata="{'type':'1100030002'}">
                            <span class="blue">上传Word</span>
                        </div>
                        <div class="thesisbor" style="width: 100%!important;">

                        </div>
                    </div>
                </li>
                <li class="clearfix upload-file-li">
                    <label class="fl gary" style="width: 15%!important;">著作权登记表</label>
                    <div class="fl upload-file-div">
                        <div>
                            <img id="file1100030003" lay-filter="file1100030003" src="/plugin/common/images/57@2x.png"
                                 class="thesisimg3 file-upload" filedata="{'type':'1100030003'}">
                            <span class="blue">上传pdf</span>
                        </div>
                        <div class="thesisbor" style="width: 100%!important;">

                        </div>
                    </div>
                </li>
                <li class="clearfix upload-file-li">
                    <label class="fl gary" style="width: 15%!important;">演示视频</label>
                    <div class="fl upload-file-div">
                        <div>
                            <img id="file1100030006" lay-filter="file1100030006" src="/plugin/common/images/57@2x.png"
                                 class="thesisimg3 file-upload" filedata="{'type':'1100030006'}">
                            <span class="blue">上传视频</span>
                        </div>
                        <div class="thesisbor" style="width: 100%!important;">
                        </div>
                    </div>
                </li>
            </ul>
            <div style="margin-top:10px">软著登记受理通知书</div>
            <ul class="clearfix">
                <li class="clearfix h34">
                    <label class="fl gary">受理号</label>
                    <div class="fl">
                        <input type="text" name="spfF4" lay-maxlength="128" lay-verify="maxlength"
                               value="${formData.spfF4}" placeholder="填写受理号"/>
                    </div>
                </li>
                <li class="clearfix h34">
                    <label class="fl gary">受理时间</label>
                    <div class="fl">
                        <input type="text" name="spfF5" lay-maxlength="128" lay-verify="maxlength" id="spfF5"
                               value="${formData.spfF5}" placeholder="填写受理时间"/>
                    </div>
                </li>
            </ul>
            <ul class="writingul">
                <li class="clearfix upload-file-li">
                    <label class="fl gary" style="width: 15%!important;">受理书</label>
                    <div class="fl upload-file-div">
                        <div>
                            <img id="file1100030004" lay-filter="file1100030004" src="/plugin/common/images/57@2x.png"
                                 class="thesisimg3 file-upload" filedata="{'type':'1100030004'}">
                            <span class="blue">上传pdf</span>
                        </div>
                        <div class="thesisbor" style="width: 100%!important;">

                        </div>
                    </div>
                </li>
            </ul>
            <div style="margin-top:10px">登记证书</div>
            <ul class="clearfix">
                <li class="clearfix h34">
                    <label class="fl gary">登记号</label>
                    <div class="fl">
                        <input type="text" name="spfF6" lay-maxlength="128" lay-verify="maxlength"
                               value="${formData.spfF6}" placeholder="填写受理号"/>
                    </div>
                </li>
                <li class="clearfix h34">
                    <label class="fl gary">授权时间</label>
                    <div class="fl">
                        <input type="text" name="spfF7" lay-maxlength="128" lay-verify="maxlength" id="spfF7"
                               value="${formData.spfF7}" placeholder="填写受理时间"/>
                    </div>
                </li>
            </ul>
            <ul class="writingul">
                <li class="clearfix upload-file-li">
                    <label class="fl gary" style="width: 15%!important;">登记证书</label>
                    <div class="fl upload-file-div">
                        <div>
                            <img id="file1100030005" lay-filter="file1100030005" src="/plugin/common/images/57@2x.png"
                                 class="thesisimg3 file-upload" filedata="{'type':'1100030005'}">
                            <span class="blue">上传pdf</span>
                        </div>
                        <div class="thesisbor" style="width: 100%!important;">

                        </div>
                    </div>
                </li>
                <li class="clearfix beizhu-li">
                    <label class="fl gary" style="width: 15%!important;">备注</label>
                    <div class="fl beizhu-div">
                        <textarea name="spfF8" lay-maxlength="200" lay-verify="maxlength" rows="" cols=""
                                  placeholder="填写备注">${formData.spfF8}</textarea>
                    </div>
                </li>
            </ul>
        </div>
    </div>
    <div class="layui-footer"
         style="width: 100%;text-align: center;background-color: #fff;position:fixed;bottom:0px;height: 50px;padding-top: 15px">
        <input class="layui-btn layui-btn-primary layui-btn-sm" type="button" value="关闭"
               onclick="_itkl.content.layerClose()">
        <input id="sub-btn" class="layui-btn layui-btn-normal layui-btn-sm" lay-submit lay-filter="formDemo"
               type="button" value="确定">
    </div>
</form>
<!--JQ-->
<script type="text/javascript" charset="utf-8" src="/plugin/common/js/jquery-1.8.3.min.js"></script>
<!--公用样式JS-->
<script type="text/javascript" charset="utf-8" src="/plugin/common/js/comment.js"></script>
<!--选择城市js-->
<script type="text/javascript" src="${re.contextPath}/plugin/layui/layui.all.js"></script>
<script type="text/javascript" charset="utf-8" src="/plugin/it/common/js/itkl.js"></script>
<script type="text/javascript" charset="utf-8" src="/plugin/common/js/form.file.js"></script>
<script type="text/javascript" src="${re.contextPath}/plugin/tools/tool.js"></script>
<script>
    var dicId = '${dicId}';
    var formCode = '${formCode}';
    var temp = '${temp}';
    var fileCount = '${fileCount}';
    var edit = '${edit}';
    var deledFileIds = [];
    layui.use(['form', 'layer', 'upload', 'element', 'table'], function () {
        var form = layui.form, layer = layui.layer, laydate = layui.laydate;
        laydate.render({   //受理时间
            elem: '#spfF5',
            event: 'click'
        })
        laydate.render({ //授权时间
            elem: '#spfF7',
            event: 'click'
        })
        form.verify({
            maxlength: function (v, item) {
                var maxlength = item.getAttribute('lay-maxlength');
                if (v.trim() != '') {
                    if (v.trim().length > maxlength) {
                        return "输入长度不能大于" + maxlength + "个字符！";
                    }
                }
            },
            number: function (v) {
                var reg = /^[0-9]*$/;
                var flag = reg.test(v.trim());
                if (!flag) {
                    return '请输入正确的数字';
                }
            },
            decimal: function (v) {
                var reg = /^-?([0-9]+|[0-9]{1,3}(,[0-9]{3})*)(.[0-9]{1,10})?$/;
                var flag = reg.test(v.trim());
                if (!flag) {
                    return '请输入正确的金额';
                }
            },
            perdecimal: function (v) {
                var reg = /^[1-9][0-9]*([.][0-9]+)?$/;
                var flag = reg.test(v.trim());
                if (!flag) {
                    if (v.trim() != "0" || v.trim() != 0) {
                        return '请输入数字';
                    }
                }
            }
        })
        //提交
        form.on('submit(formDemo)', function (data) {
            $('#sub-btn').attr('disabled', 'disabled');
            data.field.spfF29 = dicId;
            data.field.spfF30 = formCode;
            if (deledFileIds && deledFileIds.length > 0) {
                for (var a = 0; a < deledFileIds.length; a++) {
                    data.field['strList9[' + a + ']'] = deledFileIds[a];
                }
            }
            var json = data.field;
            if (json) {
                layerAjax("/it/form/insertBook", json, '', function (d) {
                    if (d) {
                        layer.msg(d.msg, {icon: 1})
                        setTimeout(function () {
                            parent.location.reload();
                            var index = parent.layer.getFrameIndex(window.name);
                            parent.layer.close(index);
                        }, 1000);
                    } else {
                        $('#sub-btn').removeAttr('disabled');
                        layer.msg(d.msg, {icon: 2})
                    }
                })

            }
        })

    })

    $(function () {
        $('input').attr('autocomplete', 'off');
        var uploadFileAdds = $('.file-upload');
        if (uploadFileAdds && uploadFileAdds.length > 0) {
            bindOneUploader(uploadFileAdds, 0);
        }
        if (edit && edit == '1') {
            initFileShow();
        }
    })

    //显示上传的文件:
    function initFileShow() {
        var uploadFileAdds = $('.file-upload');
        initOneFileShow(uploadFileAdds, 0);
    }

    function initOneFileShow(uploadFileAdds, i) {
        var aFileUploadAdd = $(uploadFileAdds[i]);
        var fileDataStr = aFileUploadAdd.attr('filedata');
        var fileData = eval('(' + fileDataStr + ')');
        var fileContainer = aFileUploadAdd.parent().next();
        var type = fileData.type;
        layerAjaxGetIT('/it/form/getFileList', {
            dicId: dicId,
            formFileType: type
        }, '', uploadFileAdds, i, function (res) {
            if (res.flag) {
                //显示:
                showFile(res.data, fileContainer, 0);
            }
        })

    }

    function showFile(filelist, container, ind) {
        if (filelist && filelist.length > 0 && (ind < filelist.length)) {
            var aFile = filelist[ind];
            var newFileId = aFile.id;
            var newIndex = $('.form-file-div-' + aFile.type).length * 1;
            var fileName = '';
            if (aFile.type == '1100030001') {
                fileName = 'strList2';
            } else if (aFile.type == '1100030002') {
                fileName = 'strList3';
            } else if (aFile.type == '1100030003') {
                fileName = 'strList4';
            } else if (aFile.type == '1100030004') {
                fileName = 'strList5';
            } else if (aFile.type == '1100030005') {
                fileName = 'strList6';
            } else if (aFile.type == '1100030006') {
                fileName = 'strList7';
            }
            container.prepend('<div class="clearfix form-file-div form-file-div-' + aFile.type + '">\n' +
                '                            <span class="fl file-name-span">' + aFile.fileName + '</span>\n' +
                '                            <img src="/plugin/common/images/89@2x.png" class="fr cursor" onclick="_form_file.del.delReal(this,' + '&apos;' + aFile.id + '&apos;' + ',' + '&apos;' + aFile.type + '&apos;' + ',deledFileIds)">\n' +
                '                            <input type="hidden" class="' + aFile.type + '-input" name="' + fileName + '[' + newIndex + ']" value="' + newFileId + '" />' +
                '                        </div>');
            ind++;
            showFile(filelist, container, ind);
        }
    }

    //绑定上传组件单个
    function bindOneUploader(uploadFileAdds, i) {
        var aFileUploadAdd = $(uploadFileAdds[i]);
        var id = aFileUploadAdd.attr('id');
        var fileDataStr = aFileUploadAdd.attr('filedata');
        var fileData = eval('(' + fileDataStr + ')');
        if (edit && edit == '1') {
            fileData['linkId'] = '${formCenterFileId}';
        }
        var fileContainer = aFileUploadAdd.parent().next();
        var type = fileData.type;
        var ext = '';
        var fileName = '';
        if (type == '1100030001') {
            ext = 'doc|docx';
            fileName = 'strList2';
        } else if (type == '1100030002') {
            ext = 'doc|docx';
            fileName = 'strList3';
        } else if (type == '1100030003') {
            ext = 'pdf';
            fileName = 'strList4';
        } else if (type == '1100030004') {
            ext = 'pdf';
            fileName = 'strList5';
        } else if (type == '1100030005') {
            ext = 'pdf';
            fileName = 'strList6';
        } else if (type == '1100030006') {
            ext = 'mp4|avi|wmv|mpg|rm|swf|mpeg';
            fileName = 'strList7';
        }
        //上传组件参数自定义:
        var uploadPara = {
            elem: '#' + id,
            accept: 'file',
            temp: temp,
            exts: ext,
            before: function (res) {
                this.data = fileData;
            },
            container: fileContainer,
            fileName: fileName,
            // fileOrder: 'desc'
        };
        _form_file.upload.bind(uploadPara);
        if (i < uploadFileAdds.length - 1) {
            i++;
            bindOneUploader(uploadFileAdds, i);
        }
    }


</script>

</body>

</html>